/*

------------------------------------------
------------------------------------------

----- Variables

------------------------------------------
------------------------------------------	

*/

:root {
	
	/* Primary color */
	
	--color-primary-background: #f09546;
	--color-primary-background-gradient-top: #f09546;
	--color-primary-background-gradient-bottom: #f09546;
	--color-primary-background-border: #df7e37;
	--color-primary-background-shadow: #000;	
	--color-primary-foreground: #f1f1f1;
	--color-primary-foreground-shadow: #000;
	
	/* Primary color - Active (used for hover/active states) */
	
	--color-primary-active-background: #e39155;
	--color-primary-active-background-gradient-top: #e39155;
	--color-primary-active-background-gradient-bottom: #e39155;	
	--color-primary-active-background-border: #df7e37;
	--color-primary-active-background-shadow: #dc8840;	
	--color-primary-active-foreground: #f1f1f1;
	--color-primary-active-foreground-shadow: #000;
	
	/* Secondary color */
	
	--color-secondary-background: #525252;
	--color-secondary-background-gradient-top: #525252;
	--color-secondary-background-gradient-bottom: #525252;
	--color-secondary-background-border: #000;	
	--color-secondary-background-shadow: #3f3e3e;
	--color-secondary-foreground: #f1f1f1;
	--color-secondary-foreground-shadow: #000;
	
	/* Secondary color - Active (used for hover/active states) */
	
	--color-secondary-active-background: #686868;
	--color-secondary-active-background-gradient-top: #686868;
	--color-secondary-active-background-gradient-bottom: #686868;	
	--color-secondary-active-background-border: #000;
	--color-secondary-active-background-shadow: #3f3e3e;	
	--color-secondary-active-foreground: #f1f1f1;
	--color-secondary-active-foreground-shadow: #000;

	/* Tertiary color */
	
	--color-tertiary-background: #f5f5f5;
	--color-tertiary-background-gradient-top: #f5f5f5;
	--color-tertiary-background-gradient-bottom: #f5f5f5;
	--color-tertiary-background-border: #dddddd;	
	--color-tertiary-background-shadow: #3f3e3e;
	--color-tertiary-foreground: #243141;
	--color-tertiary-foreground-shadow: #fff;
	
	/* Tertiary color - Active (used for hover/active states) */
	
	--color-tertiary-active-background: #f5f5f5;
	--color-tertiary-active-background-gradient-top: #f5f5f5;
	--color-tertiary-active-background-gradient-bottom: #f5f5f5;	
	--color-tertiary-active-background-border: #dddddd;
	--color-tertiary-active-background-shadow: #3f3e3e;	
	--color-tertiary-active-foreground: #243141;
	--color-tertiary-active-foreground-shadow: #fff;		
	
	/* Box color */
	
	--color-box-background: #ffffff;
	--color-box-background-gradient-top: #ffffff;
	--color-box-background-gradient-bottom: #ffffff;
	--color-box-background-border: #d2d2d2;	
	--color-box-background-shadow: #dddddd;
	--color-box-background-divider: #f4f4f4;
	--color-box-foreground: var(--color-body);
	--color-box-foreground-shadow: #fff;	
	--color-box-foreground-bold: #243141;
	--color-box-foreground-bold-shadow: #fff;	
	--color-box-head-background: #525252;
	--color-box-head-background-gradient-top: #525252;
	--color-box-head-background-gradient-bottom: #525252;	
	--color-box-head-background-border: #dddddd;
	--color-box-head-foreground: #fff;
	--color-box-head-foreground-shadow: #000;
	--color-box-head-foreground-bold: #fff;
	--color-box-head-foreground-bold-shadow: #000;	
	--color-box-footer-background: #dddddd;
	--color-box-footer-background-gradient-top: #dddddd;
	--color-box-footer-background-gradient-bottom: #dddddd;	
	--color-box-footer-background-border: #cbcbcb;
	--color-box-footer-foreground: #3f3e3e;
	--color-box-footer-foreground-shadow: #3f3e3e;	
	--color-box-footer-foreground-bold: #000;
	--color-box-footer-foreground-bold-shadow: #000;
	
	/* Box color - Active (used for hover/active states) */
	
	--color-box-active-background: #dddddd;
	--color-box-active-background-gradient-top: #dddddd;
	--color-box-active-background-gradient-bottom: #dddddd;
	--color-box-active-background-border: #9c9c9c;	
	--color-box-active-background-shadow: #a9aaac;
	--color-box-active-background-divider: #d0cece;
	--color-box-active-foreground: var(--color-body);
	--color-box-active-foreground-shadow: #fff;		
	--color-box-active-foreground-bold: #243141;
	--color-box-active-foreground-bold-shadow: #fff;
	--color-box-active-head-background: var(--color-primary-background);
	--color-box-active-head-background-gradient-top: var(--color-primary-background);
	--color-box-active-head-background-gradient-bottom: var(--color-primary-background);	
	--color-box-active-head-background-border: #dddddd;
	--color-box-active-head-foreground: var(--color-primary-foreground);
	--color-box-active-head-foreground-shadow: var(--color-primary-foreground-shadow);
	--color-box-active-head-foreground-bold: transparent;
	--color-box-active-head-foreground-bold-shadow: transparent;	
	--color-box-active-footer-background: #c4c2c2;
	--color-box-active-footer-background-gradient-top: #c4c2c2;
	--color-box-active-footer-background-gradient-bottom: #c4c2c2;		
	--color-box-active-footer-background-border: #908f8f;
	--color-box-active-footer-foreground: #3f3e3e;
	--color-box-active-footer-foreground-shadow: #3f3e3e;	
	--color-box-active-footer-foreground-bold: #000;
	--color-box-active-footer-foreground-bold-shadow: transparent;
				
	/* Badge - warning */
	
	--color-badge-hot-background: #dc1010;
	--color-badge-hot-background-gradient-top: #dc1010;
	--color-badge-hot-background-gradient-bottom: #dc1010;	
	--color-badge-hot-background-border: #dc1010;
	--color-badge-hot-foreground: #fff;	
	
	/* Badge - new */
	
	--color-badge-new-background: #45a523;
	--color-badge-new-background-gradient-top: #45a523;
	--color-badge-new-background-gradient-bottom: #45a523;		
	--color-badge-new-background-border: #45a523;
	--color-badge-new-foreground: #fff;		
	
	/* Badge - popular */
	
	--color-badge-popular-background: #dc1010;
	--color-badge-popular-background-gradient-top: #dc1010;
	--color-badge-popular-background-gradient-bottom: #dc1010;		
	--color-badge-popular-background-border: #dc1010;
	--color-badge-popular-foreground: #fff;		
	
	/* Badge - free */
	
	--color-badge-free-background: #15ace5;
	--color-badge-free-background-gradient-top: #15ace5;
	--color-badge-free-background-gradient-bottom: #15ace5;		
	--color-badge-free-background-border: #15ace5;
	--color-badge-free-foreground: #fff;
	
	/* Default colors */
	
	--background-body: #f8f8f8; /* Body background color */	
	--background-banner: #233141; /* Default background color for the banner */	
	--color-body: #696969; /* Used for body text */
	--color-heading: #243141; /* Used for heading text */
	--color-white: #f1f1f1;
	--color-black: #222222;	
	--color-border: #d2d2d2;	
	--color-green: #43de04;
	--color-red: #dc1010;
	--color-grey: #cccccc;
	
	/* ---- Sizing ---- */
	
	--container-width: 90%; /* Template container width */	
	--container-maxwidth: 1250px; /* Template container maximum width */	
	--logo-width: 225px; /* Set the max width of your logo */
	--column-1: 100%; /* Width used per column as 1 column */
	--column-2: 48%; /* Width used per column as 2 columns */
	--column-3: 32%; /* Width used per column as 3 columns */
	--column-4: 24.25%; /* Width used per column as 4 columns */
	--column-5: 19.2%; /* Width used per column as 5 columns */
	--column-6: 15.83%; /* Width used per column as 6 columns */		
	--spacing-parent: 50px; /* Used for the spacing of main elements (e,g feature boxes, tables, slideshow bottom margin) */
	--spacing-child: 30px; /* Used for the spacing of child elements (e.g bottom margin of paragraths, headings) */
	--spacing-inner: 25px; /* Used for padding on boxes */
	--text-size: 1.6em; /* Default text size (1.6em = 16px) */
	--text-lineheight: 1.6em; /* Default text line height */
	--border-radius-default: 5px; /* Set the default border radius - used through the template such as for buttons */
	--border-bottom-width-default: 3px; /* Set the bottom border of all elements. Using a higher value than 1px creates a 3D bevel effect */
	
	/* ---- Fonts ---- */
	
	--font-body: 'Open Sans', sans-serif; /* The font used for all text other than headings */
	--font-heading: 'Roboto Condensed', sans-serif; /* The font used for headings */
	
	/* ---- Misc ---- */
	
	--shadow: 0 3px 8px 2px #999999; /* Default shadow color/spacing */
	--gradient-degrees: 180deg; /* Set the angle for gradient colors */
	
	/*
	---- Settings ---- Instantly change various settings such as colors and spacing
	*/	

	/* Universal */

	--navmain-gradient-degrees: 180deg; /* Set the angle for gradient colors */
	--navmain-border-radius: 5px; /* Set the default border radius - used through the menu such as for buttons */
	--navmain-border-bottom-width: 3px; /* Set the bottom border of all elements. Using a higher value than 1px creates a 3D bevel effect */	
	--navmain-container-width: 1250px; /* Container width */
	--navmain-font: 'Open Sans',Helvetica,sans-serif,Calibri; /* Set the fonts */

	/* Header */

	--navmain-logo-width: 225px; /* Set the max width of your logo */
	--navmain-header-background: #fff; /* Set the header background color */
	--navmain-header-padding: 7px; /* Set the spacing above and below the menu */

	/* Highlight - Hot */
	
	--navmain-highlight-hot-background: #dc1010;
	--navmain-highlight-hot-background-gradient-top: #dc1010;
	--navmain-highlight-hot-background-gradient-bottom: #dc1010;	
	--navmain-highlight-hot-background-border: #dc1010;
	--navmain-highlight-hot-foreground: #fff;	
	
	/* Highlight - New */
	
	--navmain-highlight-new-background: #45a523;
	--navmain-highlight-new-background-gradient-top: #45a523;
	--navmain-highlight-new-background-gradient-bottom: #45a523;		
	--navmain-highlight-new-background-border: #45a523;
	--navmain-highlight-new-foreground: #fff;	
	
	/*
	---- Header Design 1 - Used when the header design is set to 1 in Wizard Panel > Header ----
	*/
	
	/*
	---- Main Menu ----
	*/
	
	--navmain-headerdesign1-height: 65px;
	--navmain-headerdesign1-background: transparent;
	--navmain-headerdesign1-background-gradient-top: transparent;	
	--navmain-headerdesign1-background-gradient-bottom: transparent;	
	--navmain-headerdesign1-background-border: transparent;	

	/* Main Items */

	--navmain-headerdesign1-home-foreground: var(--color-black);
	--navmain-headerdesign1-home-foreground-shadow: none;	
	--navmain-headerdesign1-button-padding: 16px;
	--navmain-headerdesign1-button-background: transparent;
	--navmain-headerdesign1-button-background-gradient-top: transparent;
	--navmain-headerdesign1-button-background-gradient-bottom: transparent;
	--navmain-headerdesign1-button-background-border: transparent;	
	--navmain-headerdesign1-button-foreground: var(--color-black);
	--navmain-headerdesign1-button-foreground-shadow: none;	
	--navmain-headerdesign1-icon: "\f0da";
	--navmain-headerdesign1-icon-foreground: var(--color-black);
	--navmain-headerdesign1-icon-foreground-shadow: none;		

	/* Main Items (hover/active) */

	--navmain-headerdesign1-home-hover-foreground: var(--color-white);
	--navmain-headerdesign1-home-hover-foreground-shadow: none;
	--navmain-headerdesign1-button-hover-background: var(--color-secondary-background);
	--navmain-headerdesign1-button-hover-background-gradient-top: var(--color-secondary-background-gradient-top);
	--navmain-headerdesign1-button-hover-background-gradient-bottom: var(--color-secondary-background-gradient-bottom);
	--navmain-headerdesign1-button-hover-background-border: transparent;	
	--navmain-headerdesign1-button-hover-foreground: var(--color-secondary-foreground);
	--navmain-headerdesign1-button-hover-foreground-shadow: none;
	--navmain-headerdesign1-icon-hover: "\f0d7";
	--navmain-headerdesign1-icon-hover-foreground: var(--color-white);
	--navmain-headerdesign1-icon-hover-foreground-shadow: none;			

	/* CTA */
	
	--navmain-headerdesign1-cta-padding: 16px;
	--navmain-headerdesign1-cta-background: var(--color-primary-background);
	--navmain-headerdesign1-cta-background-gradient-top: var(--color-primary-background-gradient-top);
	--navmain-headerdesign1-cta-background-gradient-bottom: var(--color-primary-background-gradient-bottom);
	--navmain-headerdesign1-cta-foreground: var(--color-primary-foreground);
	--navmain-headerdesign1-cta-foreground-shadow: var(--color-primary-foreground-shadow);

	/* CTA (hover) */

	--navmain-headerdesign1-cta-hover-background: var(--color-primary-active-background);
	--navmain-headerdesign1-cta-hover-background-gradient-top: var(--color-primary-active-background-gradient-top);
	--navmain-headerdesign1-cta-hover-background-gradient-bottom: var(--color-primary-active-background-gradient-bottom);	
	--navmain-headerdesign1-cta-hover-foreground: var(--color-primary-active-foreground);
	--navmain-headerdesign1-cta-hover-foreground-shadow: var(--color-primary-active-foreground-shadow);

	/* Dropdown (Mega Menu) - Used when the menu is set to Mega Menu in Wizard Panel > Header */	

	--navmain-headerdesign1-megamenu-padding: 25px;
	--navmain-headerdesign1-megamenu-background: var(--color-box-background);
	--navmain-headerdesign1-megamenu-background-gradient-top: var(--color-box-background-gradient-top);
	--navmain-headerdesign1-megamenu-background-gradient-bottom: var(--color-box-background-gradient-bottom);
	--navmain-headerdesign1-megamenu-background-border: var(--color-secondary-background);
	--navmain-headerdesign1-megamenu-background-divider: var(--color-box-background-divider);
	--navmain-headerdesign1-megamenu-foreground: var(--color-box-foreground);
	--navmain-headerdesign1-megamenu-foreground-shadow: none;	

	/* Mega Menu Items */

	--navmain-headerdesign1-megamenu-button-margin: 15px 0;
	--navmain-headerdesign1-megamenu-button-padding: 15px;
	--navmain-headerdesign1-megamenu-button-background: var(--color-box-active-background);
	--navmain-headerdesign1-megamenu-button-background-gradient-top: var(--color-box-active-background-gradient-top);
	--navmain-headerdesign1-megamenu-button-background-gradient-bottom: var(--color-box-active-background-gradient-bottom);
	--navmain-headerdesign1-megamenu-button-background-border: var(--color-box-active-background-border);
	--navmain-headerdesign1-megamenu-button-foreground: var(--color-box-active-foreground-bold);
	--navmain-headerdesign1-megamenu-button-foreground-shadow: var(--color-box-active-foreground-shadow);
	--navmain-headerdesign1-megamenu-icon-spacing: 75px;
	--navmain-headerdesign1-megamenu-icon-size: 33px;	
	
	/* Mega Menu Items (hover) */

	--navmain-headerdesign1-megamenu-button-hover-background: var(--color-secondary-background);
	--navmain-headerdesign1-megamenu-button-hover-background-gradient-top: var(--color-secondary-background-gradient-top);
	--navmain-headerdesign1-megamenu-button-hover-background-gradient-bottom: var(--color-secondary-background-gradient-bottom);
	--navmain-headerdesign1-megamenu-button-hover-background-border: var(--color-secondary-background-border);
	--navmain-headerdesign1-megamenu-button-hover-foreground: var(--color-secondary-foreground);
	--navmain-headerdesign1-megamenu-button-hover-foreground-shadow: var(--color-secondary-foreground-shadow);
	
	/* Mega Menu Items (active) */

	--navmain-headerdesign1-megamenu-button-active-background: var(--color-primary-background);
	--navmain-headerdesign1-megamenu-button-active-background-gradient-top: var(--color-primary-background-gradient-top);
	--navmain-headerdesign1-megamenu-button-active-background-gradient-bottom: var(--color-primary-background-gradient-bottom);
	--navmain-headerdesign1-megamenu-button-active-background-border: var(--color-primary-background-border);
	--navmain-headerdesign1-megamenu-button-active-foreground: var(--color-primary-foreground);
	--navmain-headerdesign1-megamenu-button-active-foreground-shadow: var(--color-primary-foreground-shadow);	

	/* Dropdown (Single) - Used when the menu is set to Dropdown in Wizard Panel > Header */
	
	--navmain-headerdesign1-width: 230px;
	--navmain-headerdesign1-dropdown-background: var(--color-box-background);
	--navmain-headerdesign1-dropdown-background-gradient-top: var(--color-box-background-gradient-top);
	--navmain-headerdesign1-dropdown-background-gradient-bottom: var(--color-box-background-gradient-bottom);
	--navmain-headerdesign1-dropdown-background-border: var(--color-secondary-background);

	/* Dropdown Items */
	
	--navmain-headerdesign1-dropdown-button-padding: 12px;
	--navmain-headerdesign1-dropdown-button-background: transparent;
	--navmain-headerdesign1-dropdown-button-background-gradient-top: transparent;
	--navmain-headerdesign1-dropdown-button-background-gradient-bottom: transparent;
	--navmain-headerdesign1-dropdown-button-background-border: var(--color-box-background-border);
	--navmain-headerdesign1-dropdown-button-foreground: var(--color-box-active-foreground-bold);
	--navmain-headerdesign1-dropdown-button-foreground-shadow: var(--color-box-active-foreground-shadow);	
	--navmain-headerdesign1-dropdown-icon: "\f061";
	--navmain-headerdesign1-dropdown-icon-foreground: var(--color-black);
	--navmain-headerdesign1-dropdown-icon-foreground-shadow: none;		
	
	/* Dropdown Items (hover) */

	--navmain-headerdesign1-dropdown-button-hover-background: var(--color-secondary-background);
	--navmain-headerdesign1-dropdown-button-hover-background-gradient-top: var(--color-secondary-background-gradient-top);
	--navmain-headerdesign1-dropdown-button-hover-background-gradient-bottom: var(--color-secondary-background-gradient-bottom);
	--navmain-headerdesign1-dropdown-button-hover-background-border: var(--color-box-background-border);
	--navmain-headerdesign1-dropdown-button-hover-foreground: var(--color-secondary-foreground);
	--navmain-headerdesign1-dropdown-button-hover-foreground-shadow: none;
	--navmain-headerdesign1-dropdown-icon-hover: "\f061";
	--navmain-headerdesign1-dropdown-icon-hover-foreground: var(--color-white);
	--navmain-headerdesign1-dropdown-icon-hover-foreground-shadow: none;		
	
	/* Dropdown Items (active) */
	
	--navmain-headerdesign1-dropdown-button-active-background: var(--color-primary-background);
	--navmain-headerdesign1-dropdown-button-active-background-gradient-top: var(--color-primary-background-gradient-top);
	--navmain-headerdesign1-dropdown-button-active-background-gradient-bottom: var(--color-primary-background-gradient-bottom);
	--navmain-headerdesign1-dropdown-button-active-background-border: var(--color-box-background-border);
	--navmain-headerdesign1-dropdown-button-active-foreground: var(--color-primary-foreground);
	--navmain-headerdesign1-dropdown-button-active-foreground-shadow: var(--color-primary-foreground-shadow);	
	--navmain-headerdesign1-dropdown-icon-active: "\f061";
	--navmain-headerdesign1-dropdown-icon-active-foreground: var(--color-white);
	--navmain-headerdesign1-dropdown-icon-active-foreground-shadow: none;
	
	/*
	---- Main Menu - Mobile (Header Design 1) ----
	*/
	
	/* Menu */
	
	--navmain-mobile-headerdesign1-height: 50px;
	--navmain-mobile-headerdesign1-background: var(--color-black);
	--navmain-mobile-headerdesign1-background-gradient-top: var(--color-black);	
	--navmain-mobile-headerdesign1-background-gradient-bottom: var(--color-black);	
	--navmain-mobile-headerdesign1-background-border: var(--color-border);	
	--navmain-mobile-headerdesign1-icon-burger: "\f0c9";
	--navmain-mobile-headerdesign1-icon-burger-active: "\f0c9";

	/* Main Items */

	--navmain-mobile-headerdesign1-home-foreground: var(--color-white);
	--navmain-mobile-headerdesign1-home-foreground-shadow: none;
	--navmain-mobile-headerdesign1-button-padding: 16px;
	--navmain-mobile-headerdesign1-button-background: transparent;
	--navmain-mobile-headerdesign1-button-background-gradient-top: transparent;
	--navmain-mobile-headerdesign1-button-background-gradient-bottom: transparent;	
	--navmain-mobile-headerdesign1-button-background-border: var(--color-border);	
	--navmain-mobile-headerdesign1-button-foreground: var(--color-white);
	--navmain-mobile-headerdesign1-button-foreground-shadow: none;	
	--navmain-mobile-headerdesign1-icon: "\f078";
	--navmain-mobile-headerdesign1-icon-foreground: var(--color-white);
	--navmain-mobile-headerdesign1-icon-foreground-shadow: none;		

	/* Main Items (hover/active) */

	--navmain-mobile-headerdesign1-home-hover-foreground: var(--color-white);
	--navmain-mobile-headerdesign1-home-hover-foreground-shadow: none;
	--navmain-mobile-headerdesign1-button-hover-background: var(--color-secondary-background);
	--navmain-mobile-headerdesign1-button-hover-background-gradient-top: var(--color-secondary-background-gradient-top);
	--navmain-mobile-headerdesign1-button-hover-background-gradient-bottom: var(--color-secondary-background-gradient-bottom);
	--navmain-mobile-headerdesign1-button-hover-background-border: var(--color-border);	
	--navmain-mobile-headerdesign1-button-hover-foreground: var(--color-secondary-foreground);
	--navmain-mobile-headerdesign1-button-hover-foreground-shadow: transparent;
	--navmain-mobile-headerdesign1-icon-hover: "\f2d1";
	--navmain-mobile-headerdesign1-icon-hover-foreground: var(--color-white);
	--navmain-mobile-headerdesign1-icon-hover-foreground-shadow: none;			

	/* CTA */
	
	--navmain-mobile-headerdesign1-cta-padding: 16px;
	--navmain-mobile-headerdesign1-cta-background: var(--color-primary-background);
	--navmain-mobile-headerdesign1-cta-background-gradient-top: var(--color-primary-background-gradient-top);
	--navmain-mobile-headerdesign1-cta-background-gradient-bottom: var(--color-primary-background-gradient-bottom);
	--navmain-mobile-headerdesign1-cta-foreground: var(--color-primary-foreground);
	--navmain-mobile-headerdesign1-cta-foreground-shadow: var(--color-primary-foreground-shadow);

	/* CTA (hover) */

	--navmain-mobile-headerdesign1-cta-hover-background: var(--color-primary-active-background);
	--navmain-mobile-headerdesign1-cta-hover-background-gradient-top: var(--color-primary-active-background-gradient-top);
	--navmain-mobile-headerdesign1-cta-hover-background-gradient-bottom: var(--color-primary-active-background-gradient-bottom);	
	--navmain-mobile-headerdesign1-cta-hover-foreground: var(--color-primary-active-foreground);
	--navmain-mobile-headerdesign1-cta-hover-foreground-shadow: var(--color-primary-active-foreground-shadow);

	/* Dropdown (Mega Menu) - Used when the menu is set to Mega Menu in Wizard Panel > Header */	

	--navmain-mobile-headerdesign1-megamenu-padding: 15px;
	--navmain-mobile-headerdesign1-megamenu-background: var(--color-box-background);
	--navmain-mobile-headerdesign1-megamenu-background-gradient-top: var(--color-box-background-gradient-top);
	--navmain-mobile-headerdesign1-megamenu-background-gradient-bottom: var(--color-box-background-gradient-bottom);
	--navmain-mobile-headerdesign1-megamenu-background-border: var(--color-box-background-border);
	--navmain-mobile-headerdesign1-megamenu-background-divider: var(--color-box-background-divider);
	--navmain-mobile-headerdesign1-megamenu-foreground: var(--color-box-foreground);
	--navmain-mobile-headerdesign1-megamenu-foreground-shadow: none;	

	/* Mega Menu Items */

	--navmain-mobile-headerdesign1-megamenu-button-margin: 10px 0;
	--navmain-mobile-headerdesign1-megamenu-button-padding: 15px;
	--navmain-mobile-headerdesign1-megamenu-button-background: var(--color-box-active-background);
	--navmain-mobile-headerdesign1-megamenu-button-background-gradient-top: var(--color-box-active-background-gradient-top);
	--navmain-mobile-headerdesign1-megamenu-button-background-gradient-bottom: var(--color-box-active-background-gradient-bottom);
	--navmain-mobile-headerdesign1-megamenu-button-background-border: var(--color-box-active-background-border);
	--navmain-mobile-headerdesign1-megamenu-button-foreground: var(--color-box-active-foreground-bold);
	--navmain-mobile-headerdesign1-megamenu-button-foreground-shadow: var(--color-box-active-foreground-shadow);
	--navmain-mobile-headerdesign1-megamenu-icon-spacing: 75px;
	--navmain-mobile-headerdesign1-megamenu-icon-size: 33px;	
	
	/* Mega Menu Items (hover) */

	--navmain-mobile-headerdesign1-megamenu-button-hover-background: var(--color-secondary-background);
	--navmain-mobile-headerdesign1-megamenu-button-hover-background-gradient-top: var(--color-secondary-background-gradient-top);
	--navmain-mobile-headerdesign1-megamenu-button-hover-background-gradient-bottom: var(--color-secondary-background-gradient-bottom);
	--navmain-mobile-headerdesign1-megamenu-button-hover-background-border: var(--color-secondary-background-border);
	--navmain-mobile-headerdesign1-megamenu-button-hover-foreground: var(--color-secondary-foreground);
	--navmain-mobile-headerdesign1-megamenu-button-hover-foreground-shadow: var(--color-secondary-foreground-shadow);
	
	/* Mega Menu Items (active) */

	--navmain-mobile-headerdesign1-megamenu-button-active-background: var(--color-primary-background);
	--navmain-mobile-headerdesign1-megamenu-button-active-background-gradient-top: var(--color-primary-background-gradient-top);
	--navmain-mobile-headerdesign1-megamenu-button-active-background-gradient-bottom: var(--color-primary-background-gradient-bottom);
	--navmain-mobile-headerdesign1-megamenu-button-active-background-border: var(--color-primary-background-border);
	--navmain-mobile-headerdesign1-megamenu-button-active-foreground: var(--color-primary-foreground);
	--navmain-mobile-headerdesign1-megamenu-button-active-foreground-shadow: var(--color-primary-foreground-shadow);	

	/* Dropdown (Single) - Used when the menu is set to Dropdown in Wizard Panel > Header */
	
	--navmain-mobile-headerdesign1-dropdown-background: var(--color-box-background);
	--navmain-mobile-headerdesign1-dropdown-background-gradient-top: var(--color-box-background-gradient-top);
	--navmain-mobile-headerdesign1-dropdown-background-gradient-bottom: var(--color-box-background-gradient-bottom);
	--navmain-mobile-headerdesign1-dropdown-background-border: var(--color-secondary-background);

	/* Dropdown Items */
	
	--navmain-mobile-headerdesign1-dropdown-button-padding: 12px;
	--navmain-mobile-headerdesign1-dropdown-button-background: transparent;
	--navmain-mobile-headerdesign1-dropdown-button-background-gradient-top: transparent;
	--navmain-mobile-headerdesign1-dropdown-button-background-gradient-bottom: transparent;
	--navmain-mobile-headerdesign1-dropdown-button-background-border: var(--color-border);
	--navmain-mobile-headerdesign1-dropdown-button-foreground: var(--color-white);
	--navmain-mobile-headerdesign1-dropdown-button-foreground-shadow: var(--color-black);
	--navmain-mobile-headerdesign1-dropdown-icon: "\f061";	
	--navmain-mobile-headerdesign1-dropdown-icon-foreground: var(--color-white);
	--navmain-mobile-headerdesign1-dropdown-icon-foreground-shadow: none;		
	
	/* Dropdown Items (hover) */

	--navmain-mobile-headerdesign1-dropdown-button-hover-background: var(--color-secondary-background);
	--navmain-mobile-headerdesign1-dropdown-button-hover-background-gradient-top: var(--color-secondary-background-gradient-top);
	--navmain-mobile-headerdesign1-dropdown-button-hover-background-gradient-bottom: var(--color-secondary-background-gradient-bottom);
	--navmain-mobile-headerdesign1-dropdown-button-hover-background-border: var(--color-box-background-border);
	--navmain-mobile-headerdesign1-dropdown-button-hover-foreground: var(--color-secondary-foreground);
	--navmain-mobile-headerdesign1-dropdown-button-hover-foreground-shadow: none;
	--navmain-mobile-headerdesign1-dropdown-icon-hover: "\f061";	
	--navmain-mobile-headerdesign1-dropdown-icon-hover-foreground: var(--color-white);
	--navmain-mobile-headerdesign1-dropdown-icon-hover-foreground-shadow: none;		
	
	/* Dropdown Items (active) */
	
	--navmain-mobile-headerdesign1-dropdown-button-active-background: var(--color-primary-background);
	--navmain-mobile-headerdesign1-dropdown-button-active-background-gradient-top: var(--color-primary-background-gradient-top);
	--navmain-mobile-headerdesign1-dropdown-button-active-background-gradient-bottom: var(--color-primary-background-gradient-bottom);
	--navmain-mobile-headerdesign1-dropdown-button-active-background-border: var(--color-box-background-border);
	--navmain-mobile-headerdesign1-dropdown-button-active-foreground: var(--color-primary-foreground);
	--navmain-mobile-headerdesign1-dropdown-button-active-foreground-shadow: var(--color-primary-foreground-shadow);	
	--navmain-mobile-headerdesign1-dropdown-icon-active: "\f061";	
	--navmain-mobile-headerdesign1-dropdown-icon-active-foreground: var(--color-white);
	--navmain-mobile-headerdesign1-dropdown-icon-active-foreground-shadow: none;
	
	/*
	---- Header Design 2 - Used when the header design is set to 2 in Wizard Panel > Header ----
	*/
	
	/*
	---- Main Menu ----
	*/
	
	--navmain-headerdesign2-height: 65px;
	--navmain-headerdesign2-background: var(--color-black);
	--navmain-headerdesign2-background-gradient-top: var(--color-black);	
	--navmain-headerdesign2-background-gradient-bottom: var(--color-black);	
	--navmain-headerdesign2-background-border: var(--color-border);	

	/* Main Items */

	--navmain-headerdesign2-home-foreground: var(--color-white);
	--navmain-headerdesign2-home-foreground-shadow: none;	
	--navmain-headerdesign2-button-padding: 16px;
	--navmain-headerdesign2-button-background: transparent;
	--navmain-headerdesign2-button-background-gradient-top: transparent;
	--navmain-headerdesign2-button-background-gradient-bottom: transparent;
	--navmain-headerdesign2-button-background-border: transparent;	
	--navmain-headerdesign2-button-foreground: var(--color-white);
	--navmain-headerdesign2-button-foreground-shadow: none;	
	--navmain-headerdesign2-icon: "\f0da";
	--navmain-headerdesign2-icon-foreground: var(--color-white);
	--navmain-headerdesign2-icon-foreground-shadow: none;		

	/* Main Items (hover/active) */

	--navmain-headerdesign2-home-hover-foreground: var(--color-white);
	--navmain-headerdesign2-home-hover-foreground-shadow: none;
	--navmain-headerdesign2-button-hover-background: var(--color-secondary-background);
	--navmain-headerdesign2-button-hover-background-gradient-top: var(--color-secondary-background-gradient-top);
	--navmain-headerdesign2-button-hover-background-gradient-bottom: var(--color-secondary-background-gradient-bottom);
	--navmain-headerdesign2-button-hover-background-border: transparent;	
	--navmain-headerdesign2-button-hover-foreground: var(--color-secondary-foreground);
	--navmain-headerdesign2-button-hover-foreground-shadow: none;
	--navmain-headerdesign2-icon-hover: "\f0d7";
	--navmain-headerdesign2-icon-hover-foreground: var(--color-white);
	--navmain-headerdesign2-icon-hover-foreground-shadow: none;			

	/* CTA */
	
	--navmain-headerdesign2-cta-padding: 16px;
	--navmain-headerdesign2-cta-background: var(--color-primary-background);
	--navmain-headerdesign2-cta-background-gradient-top: var(--color-primary-background-gradient-top);
	--navmain-headerdesign2-cta-background-gradient-bottom: var(--color-primary-background-gradient-bottom);
	--navmain-headerdesign2-cta-foreground: var(--color-primary-foreground);
	--navmain-headerdesign2-cta-foreground-shadow: var(--color-primary-foreground-shadow);

	/* CTA (hover) */

	--navmain-headerdesign2-cta-hover-background: var(--color-primary-active-background);
	--navmain-headerdesign2-cta-hover-background-gradient-top: var(--color-primary-active-background-gradient-top);
	--navmain-headerdesign2-cta-hover-background-gradient-bottom: var(--color-primary-active-background-gradient-bottom);	
	--navmain-headerdesign2-cta-hover-foreground: var(--color-primary-active-foreground);
	--navmain-headerdesign2-cta-hover-foreground-shadow: var(--color-primary-active-foreground-shadow);

	/* Dropdown (Mega Menu) - Used when the menu is set to Mega Menu in Wizard Panel > Header */	

	--navmain-headerdesign2-megamenu-padding: 25px;
	--navmain-headerdesign2-megamenu-background: var(--color-box-background);
	--navmain-headerdesign2-megamenu-background-gradient-top: var(--color-box-background-gradient-top);
	--navmain-headerdesign2-megamenu-background-gradient-bottom: var(--color-box-background-gradient-bottom);
	--navmain-headerdesign2-megamenu-background-border: var(--color-secondary-background);
	--navmain-headerdesign2-megamenu-background-divider: var(--color-box-background-divider);
	--navmain-headerdesign2-megamenu-foreground: var(--color-box-foreground);
	--navmain-headerdesign2-megamenu-foreground-shadow: none;	

	/* Mega Menu Items */

	--navmain-headerdesign2-megamenu-button-margin: 15px 0;
	--navmain-headerdesign2-megamenu-button-padding: 15px;
	--navmain-headerdesign2-megamenu-button-background: var(--color-box-active-background);
	--navmain-headerdesign2-megamenu-button-background-gradient-top: var(--color-box-active-background-gradient-top);
	--navmain-headerdesign2-megamenu-button-background-gradient-bottom: var(--color-box-active-background-gradient-bottom);
	--navmain-headerdesign2-megamenu-button-background-border: var(--color-box-active-background-border);
	--navmain-headerdesign2-megamenu-button-foreground: var(--color-box-active-foreground-bold);
	--navmain-headerdesign2-megamenu-button-foreground-shadow: var(--color-box-active-foreground-shadow);
	--navmain-headerdesign2-megamenu-icon-spacing: 75px;
	--navmain-headerdesign2-megamenu-icon-size: 33px;	
	
	/* Mega Menu Items (hover) */

	--navmain-headerdesign2-megamenu-button-hover-background: var(--color-secondary-background);
	--navmain-headerdesign2-megamenu-button-hover-background-gradient-top: var(--color-secondary-background-gradient-top);
	--navmain-headerdesign2-megamenu-button-hover-background-gradient-bottom: var(--color-secondary-background-gradient-bottom);
	--navmain-headerdesign2-megamenu-button-hover-background-border: var(--color-secondary-background-border);
	--navmain-headerdesign2-megamenu-button-hover-foreground: var(--color-secondary-foreground);
	--navmain-headerdesign2-megamenu-button-hover-foreground-shadow: var(--color-secondary-foreground-shadow);
	
	/* Mega Menu Items (active) */

	--navmain-headerdesign2-megamenu-button-active-background: var(--color-primary-background);
	--navmain-headerdesign2-megamenu-button-active-background-gradient-top: var(--color-primary-background-gradient-top);
	--navmain-headerdesign2-megamenu-button-active-background-gradient-bottom: var(--color-primary-background-gradient-bottom);
	--navmain-headerdesign2-megamenu-button-active-background-border: var(--color-primary-background-border);
	--navmain-headerdesign2-megamenu-button-active-foreground: var(--color-primary-foreground);
	--navmain-headerdesign2-megamenu-button-active-foreground-shadow: var(--color-primary-foreground-shadow);	

	/* Dropdown (Single) - Used when the menu is set to Dropdown in Wizard Panel > Header */
	
	--navmain-headerdesign2-width: 230px;
	--navmain-headerdesign2-dropdown-background: var(--color-box-background);
	--navmain-headerdesign2-dropdown-background-gradient-top: var(--color-box-background-gradient-top);
	--navmain-headerdesign2-dropdown-background-gradient-bottom: var(--color-box-background-gradient-bottom);
	--navmain-headerdesign2-dropdown-background-border: var(--color-secondary-background);

	/* Dropdown Items */
	
	--navmain-headerdesign2-dropdown-button-padding: 12px;
	--navmain-headerdesign2-dropdown-button-background: transparent;
	--navmain-headerdesign2-dropdown-button-background-gradient-top: transparent;
	--navmain-headerdesign2-dropdown-button-background-gradient-bottom: transparent;
	--navmain-headerdesign2-dropdown-button-background-border: var(--color-box-background-border);
	--navmain-headerdesign2-dropdown-button-foreground: var(--color-box-active-foreground-bold);
	--navmain-headerdesign2-dropdown-button-foreground-shadow: var(--color-box-active-foreground-shadow);	
	--navmain-headerdesign2-dropdown-icon: "\f061";
	--navmain-headerdesign2-dropdown-icon-foreground: var(--color-black);
	--navmain-headerdesign2-dropdown-icon-foreground-shadow: none;		
	
	/* Dropdown Items (hover) */

	--navmain-headerdesign2-dropdown-button-hover-background: var(--color-secondary-background);
	--navmain-headerdesign2-dropdown-button-hover-background-gradient-top: var(--color-secondary-background-gradient-top);
	--navmain-headerdesign2-dropdown-button-hover-background-gradient-bottom: var(--color-secondary-background-gradient-bottom);
	--navmain-headerdesign2-dropdown-button-hover-background-border: var(--color-box-background-border);
	--navmain-headerdesign2-dropdown-button-hover-foreground: var(--color-secondary-foreground);
	--navmain-headerdesign2-dropdown-button-hover-foreground-shadow: none;
	--navmain-headerdesign2-dropdown-icon-hover: "\f061";
	--navmain-headerdesign2-dropdown-icon-hover-foreground: var(--color-white);
	--navmain-headerdesign2-dropdown-icon-hover-foreground-shadow: none;		
	
	/* Dropdown Items (active) */
	
	--navmain-headerdesign2-dropdown-button-active-background: var(--color-primary-background);
	--navmain-headerdesign2-dropdown-button-active-background-gradient-top: var(--color-primary-background-gradient-top);
	--navmain-headerdesign2-dropdown-button-active-background-gradient-bottom: var(--color-primary-background-gradient-bottom);
	--navmain-headerdesign2-dropdown-button-active-background-border: var(--color-box-background-border);
	--navmain-headerdesign2-dropdown-button-active-foreground: var(--color-primary-foreground);
	--navmain-headerdesign2-dropdown-button-active-foreground-shadow: var(--color-primary-foreground-shadow);	
	--navmain-headerdesign2-dropdown-icon-active: "\f061";
	--navmain-headerdesign2-dropdown-icon-active-foreground: var(--color-white);
	--navmain-headerdesign2-dropdown-icon-active-foreground-shadow: none;		
	
	/*
	---- Main Menu - Mobile (Header Design 2) ----
	*/
	
	/* Menu */
	
	--navmain-mobile-headerdesign2-height: 50px;
	--navmain-mobile-headerdesign2-background: var(--color-black);
	--navmain-mobile-headerdesign2-background-gradient-top: var(--color-black);	
	--navmain-mobile-headerdesign2-background-gradient-bottom: var(--color-black);	
	--navmain-mobile-headerdesign2-background-border: var(--color-border);	
	--navmain-mobile-headerdesign2-icon-burger: "\f0c9";
	--navmain-mobile-headerdesign2-icon-burger-active: "\f0c9";

	/* Main Items */

	--navmain-mobile-headerdesign2-home-foreground: var(--color-white);
	--navmain-mobile-headerdesign2-home-foreground-shadow: none;
	--navmain-mobile-headerdesign2-button-padding: 16px;
	--navmain-mobile-headerdesign2-button-background: transparent;
	--navmain-mobile-headerdesign2-button-background-gradient-top: transparent;
	--navmain-mobile-headerdesign2-button-background-gradient-bottom: transparent;	
	--navmain-mobile-headerdesign2-button-background-border: var(--color-border);	
	--navmain-mobile-headerdesign2-button-foreground: var(--color-white);
	--navmain-mobile-headerdesign2-button-foreground-shadow: none;	
	--navmain-mobile-headerdesign2-icon: "\f078";
	--navmain-mobile-headerdesign2-icon-foreground: var(--color-white);
	--navmain-mobile-headerdesign2-icon-foreground-shadow: none;		

	/* Main Items (hover/active) */

	--navmain-mobile-headerdesign2-home-hover-foreground: var(--color-white);
	--navmain-mobile-headerdesign2-home-hover-foreground-shadow: none;
	--navmain-mobile-headerdesign2-button-hover-background: transparent;
	--navmain-mobile-headerdesign2-button-hover-background-gradient-top: transparent;
	--navmain-mobile-headerdesign2-button-hover-background-gradient-bottom: transparent;
	--navmain-mobile-headerdesign2-button-hover-background-border: var(--color-border);	
	--navmain-mobile-headerdesign2-button-hover-foreground: var(--color-primary-background);
	--navmain-mobile-headerdesign2-button-hover-foreground-shadow: transparent;
	--navmain-mobile-headerdesign2-icon-hover: "\f2d1";
	--navmain-mobile-headerdesign2-icon-hover-foreground: var(--color-primary-background);
	--navmain-mobile-headerdesign2-icon-hover-foreground-shadow: none;			

	/* CTA */
	
	--navmain-mobile-headerdesign2-cta-padding: 16px;
	--navmain-mobile-headerdesign2-cta-background: var(--color-primary-background);
	--navmain-mobile-headerdesign2-cta-background-gradient-top: var(--color-primary-background-gradient-top);
	--navmain-mobile-headerdesign2-cta-background-gradient-bottom: var(--color-primary-background-gradient-bottom);
	--navmain-mobile-headerdesign2-cta-foreground: var(--color-primary-foreground);
	--navmain-mobile-headerdesign2-cta-foreground-shadow: var(--color-primary-foreground-shadow);

	/* CTA (hover) */

	--navmain-mobile-headerdesign2-cta-hover-background: var(--color-primary-active-background);
	--navmain-mobile-headerdesign2-cta-hover-background-gradient-top: var(--color-primary-active-background-gradient-top);
	--navmain-mobile-headerdesign2-cta-hover-background-gradient-bottom: var(--color-primary-active-background-gradient-bottom);	
	--navmain-mobile-headerdesign2-cta-hover-foreground: var(--color-primary-active-foreground);
	--navmain-mobile-headerdesign2-cta-hover-foreground-shadow: var(--color-primary-active-foreground-shadow);

	/* Dropdown (Mega Menu) - Used when the menu is set to Mega Menu in Wizard Panel > Header */	

	--navmain-mobile-headerdesign2-megamenu-padding: 15px;
	--navmain-mobile-headerdesign2-megamenu-background: transparent;
	--navmain-mobile-headerdesign2-megamenu-background-gradient-top: transparent;
	--navmain-mobile-headerdesign2-megamenu-background-gradient-bottom: transparent;
	--navmain-mobile-headerdesign2-megamenu-background-border: transparent;
	--navmain-mobile-headerdesign2-megamenu-background-divider: var(--color-box-background-divider);
	--navmain-mobile-headerdesign2-megamenu-foreground: var(--color-box-foreground);
	--navmain-mobile-headerdesign2-megamenu-foreground-shadow: none;	

	/* Mega Menu Items */

	--navmain-mobile-headerdesign2-megamenu-button-margin: 10px 0;
	--navmain-mobile-headerdesign2-megamenu-button-padding: 15px;
	--navmain-mobile-headerdesign2-megamenu-button-background: var(--color-box-active-background);
	--navmain-mobile-headerdesign2-megamenu-button-background-gradient-top: var(--color-box-active-background-gradient-top);
	--navmain-mobile-headerdesign2-megamenu-button-background-gradient-bottom: var(--color-box-active-background-gradient-bottom);
	--navmain-mobile-headerdesign2-megamenu-button-background-border: var(--color-box-active-background-border);
	--navmain-mobile-headerdesign2-megamenu-button-foreground: var(--color-box-active-foreground-bold);
	--navmain-mobile-headerdesign2-megamenu-button-foreground-shadow: var(--color-box-active-foreground-shadow);
	--navmain-mobile-headerdesign2-megamenu-icon-spacing: 75px;
	--navmain-mobile-headerdesign2-megamenu-icon-size: 33px;	
	
	/* Mega Menu Items (hover) */

	--navmain-mobile-headerdesign2-megamenu-button-hover-background: var(--color-secondary-background);
	--navmain-mobile-headerdesign2-megamenu-button-hover-background-gradient-top: var(--color-secondary-background-gradient-top);
	--navmain-mobile-headerdesign2-megamenu-button-hover-background-gradient-bottom: var(--color-secondary-background-gradient-bottom);
	--navmain-mobile-headerdesign2-megamenu-button-hover-background-border: var(--color-secondary-background-border);
	--navmain-mobile-headerdesign2-megamenu-button-hover-foreground: var(--color-secondary-foreground);
	--navmain-mobile-headerdesign2-megamenu-button-hover-foreground-shadow: var(--color-secondary-foreground-shadow);
	
	/* Mega Menu Items (active) */

	--navmain-mobile-headerdesign2-megamenu-button-active-background: var(--color-primary-background);
	--navmain-mobile-headerdesign2-megamenu-button-active-background-gradient-top: var(--color-primary-background-gradient-top);
	--navmain-mobile-headerdesign2-megamenu-button-active-background-gradient-bottom: var(--color-primary-background-gradient-bottom);
	--navmain-mobile-headerdesign2-megamenu-button-active-background-border: var(--color-primary-background-border);
	--navmain-mobile-headerdesign2-megamenu-button-active-foreground: var(--color-primary-foreground);
	--navmain-mobile-headerdesign2-megamenu-button-active-foreground-shadow: var(--color-primary-foreground-shadow);	

	/* Dropdown (Single) - Used when the menu is set to Dropdown in Wizard Panel > Header */
	
	--navmain-mobile-headerdesign2-dropdown-background: transparent;
	--navmain-mobile-headerdesign2-dropdown-background-gradient-top: transparent;
	--navmain-mobile-headerdesign2-dropdown-background-gradient-bottom: transparent;
	--navmain-mobile-headerdesign2-dropdown-background-border: transparent;

	/* Dropdown Items */
	
	--navmain-mobile-headerdesign2-dropdown-button-padding: 12px;
	--navmain-mobile-headerdesign2-dropdown-button-background: transparent;
	--navmain-mobile-headerdesign2-dropdown-button-background-gradient-top: transparent;
	--navmain-mobile-headerdesign2-dropdown-button-background-gradient-bottom: transparent;
	--navmain-mobile-headerdesign2-dropdown-button-background-border: var(--color-border);
	--navmain-mobile-headerdesign2-dropdown-button-foreground: var(--color-white);
	--navmain-mobile-headerdesign2-dropdown-button-foreground-shadow: var(--color-black);
	--navmain-mobile-headerdesign2-dropdown-icon: "\f061";	
	--navmain-mobile-headerdesign2-dropdown-icon-foreground: var(--color-white);
	--navmain-mobile-headerdesign2-dropdown-icon-foreground-shadow: none;		
	
	/* Dropdown Items (hover) */

	--navmain-mobile-headerdesign2-dropdown-button-hover-background: var(--color-secondary-background);
	--navmain-mobile-headerdesign2-dropdown-button-hover-background-gradient-top: var(--color-secondary-background-gradient-top);
	--navmain-mobile-headerdesign2-dropdown-button-hover-background-gradient-bottom: var(--color-secondary-background-gradient-bottom);
	--navmain-mobile-headerdesign2-dropdown-button-hover-background-border: var(--color-box-background-border);
	--navmain-mobile-headerdesign2-dropdown-button-hover-foreground: var(--color-secondary-foreground);
	--navmain-mobile-headerdesign2-dropdown-button-hover-foreground-shadow: none;
	--navmain-mobile-headerdesign2-dropdown-icon-hover: "\f061";	
	--navmain-mobile-headerdesign2-dropdown-icon-hover-foreground: var(--color-white);
	--navmain-mobile-headerdesign2-dropdown-icon-hover-foreground-shadow: none;		
	
	/* Dropdown Items (active) */
	
	--navmain-mobile-headerdesign2-dropdown-button-active-background: var(--color-primary-background);
	--navmain-mobile-headerdesign2-dropdown-button-active-background-gradient-top: var(--color-primary-background-gradient-top);
	--navmain-mobile-headerdesign2-dropdown-button-active-background-gradient-bottom: var(--color-primary-background-gradient-bottom);
	--navmain-mobile-headerdesign2-dropdown-button-active-background-border: var(--color-box-background-border);
	--navmain-mobile-headerdesign2-dropdown-button-active-foreground: var(--color-primary-foreground);
	--navmain-mobile-headerdesign2-dropdown-button-active-foreground-shadow: var(--color-primary-foreground-shadow);	
	--navmain-mobile-headerdesign2-dropdown-icon-active: "\f061";	
	--navmain-mobile-headerdesign2-dropdown-icon-active-foreground: var(--color-white);
	--navmain-mobile-headerdesign2-dropdown-icon-active-foreground-shadow: none;	
	
	/*
	---- WHMCS Steps - Displayed on the cart page of WHMCS ----
	*/	
	
	/* Header Design 1 */
	
	--whmcs-cartsteps-headerdesign1-foreground: var(--color-black);
	--whmcs-cartsteps-headerdesign1-foreground-shadow: transparent;
	
	--whmcs-cartsteps-headerdesign1-button-active-background: var(--color-secondary-background);	
	--whmcs-cartsteps-headerdesign1-button-active-background-gradient-top: var(--color-secondary-background);	
	--whmcs-cartsteps-headerdesign1-button-active-background-gradient-bottom: var(--color-secondary-background);	
	--whmcs-cartsteps-headerdesign1-button-active-foreground: var(--color-secondary-foreground);	
	--whmcs-cartsteps-headerdesign1-button-active-foreground-shadow: var(--color-secondary-foreground-shadow);	
	
	/* Mobile */
	
	--whmcs-cartsteps-mobile-headerdesign1-foreground: var(--color-white);
	--whmcs-cartsteps-mobile-headerdesign1-foreground-shadow: transparent;
	
	--whmcs-cartsteps-mobile-headerdesign1-button-active-background: var(--color-secondary-background);	
	--whmcs-cartsteps-mobile-headerdesign1-button-active-background-gradient-top: var(--color-secondary-background);	
	--whmcs-cartsteps-mobile-headerdesign1-button-active-background-gradient-bottom: var(--color-secondary-background);	
	--whmcs-cartsteps-mobile-headerdesign1-button-active-foreground: var(--color-secondary-foreground);	
	--whmcs-cartsteps-mobile-headerdesign1-button-active-foreground-shadow: var(--color-secondary-foreground-shadow);		
	
	/* Header Design 2 */
	
	--whmcs-cartsteps-headerdesign2-foreground: var(--color-white);
	--whmcs-cartsteps-headerdesign2-foreground-shadow: transparent;
	
	--whmcs-cartsteps-headerdesign2-button-active-background: var(--color-secondary-background);	
	--whmcs-cartsteps-headerdesign2-button-active-background-gradient-top: var(--color-secondary-background);	
	--whmcs-cartsteps-headerdesign2-button-active-background-gradient-bottom: var(--color-secondary-background);	
	--whmcs-cartsteps-headerdesign2-button-active-foreground: var(--color-secondary-foreground);	
	--whmcs-cartsteps-headerdesign2-button-active-foreground-shadow: var(--color-secondary-foreground-shadow);		
	
	/* Mobile */
	
	--whmcs-cartsteps-mobile-headerdesign2-foreground: var(--color-white);
	--whmcs-cartsteps-mobile-headerdesign2-foreground-shadow: transparent;
	
	--whmcs-cartsteps-mobile-headerdesign2-button-active-background: var(--color-secondary-background);	
	--whmcs-cartsteps-mobile-headerdesign2-button-active-background-gradient-top: var(--color-secondary-background);	
	--whmcs-cartsteps-mobile-headerdesign2-button-active-background-gradient-bottom: var(--color-secondary-background);	
	--whmcs-cartsteps-mobile-headerdesign2-button-active-foreground: var(--color-secondary-foreground);	
	--whmcs-cartsteps-mobile-headerdesign2-button-active-foreground-shadow: var(--color-secondary-foreground-shadow);			